<template>
	<view>
		<template v-if="list.length > 0">
			<block v-for="(item, index) in list" :key="index">
				<template v-if="searchType == 'post'">
					<index-list :item="item" @changeevent="updateData"></index-list>
				</template>
				<template v-else-if="searchType == 'topic'">
					<view style="padding: 0 20rpx;">
						<topic-list :item="item"></topic-list>
					</view>
				</template>
			</block>
			<!-- 上拉加载 -->
			<load-more :loadText="loadText"></load-more>
		</template>
		<template v-else-if="isSearch && list.length < 1">
			<no-thing></no-thing>
		</template>
	</view>
</template>

<script>
	import indexList from '../../components/index/index-list.vue'
	import noThing from '../../components/common/no-thing.vue'
	import loadMore from '../../components/common/load-more.vue'
	import topicList from '../../components/news/topic-list.vue'
	export default {
		data() {
			return {
				isSearch: false,
				loadText: '上拉加载更多',
				list: [],
				searchtext: '',
				page: 1,
				searchType: 'post',
			}
		},
		components: {
			indexList,
			noThing,
			loadMore,
			topicList,
		},
		// 介绍-> 框架简介 -> 生命周期 -> 页面生命周期：监听原生标题栏按钮点击事件（取消按钮）
		onNavigationBarButtonTap(e) {
			if (e.index === 0) {
				uni.navigateBack({
					delta: 1
				})
			}
		},
		// 监听原生标题栏搜索输入框输入内容变化事件（监听搜索框文本变化）
		onNavigationBarSearchInputChanged(e) {
			// console.log(e.text)
			this.searchtext = e.text
		},
		// 监听原生标题栏搜索输入框搜索事件,用户点击软键盘上的搜索按钮时触发（监听点击搜索按钮事件）
		onNavigationBarSearchInputConfirmed(e) {
			// console.log(e.text)
			if (e.text) {
				this.getData()
			}
		},
		onReachBottom() { // 监听页面触底事件
			this.loadMore()
		},
		onPullDownRefresh() { // 监听下拉刷新
			this.getData()
			uni.stopPullDownRefresh()
		},
		onLoad(e) {
			if (!e) return
			this.searchType = e.searchType || 'post'
			// #ifdef APP-PLUS
			if (this.searchType == 'topic') {
				let currentwebview = this.$mp.page.$getAppWebview()
				let tn = currentwebview.getStyle().titleNView
				tn.searchInput.placeholder = '搜索话题'
				currentwebview.setStyle({
					titleNView: tn
				})
			}
			// #endif
			// 开启监听
			uni.$on('updateData', this.updateData)
		},
		methods: {
			updateData(data) {
				switch(data.type) {
					case 'guanzhu':
					this.updateGuanZhu(data)
						break
					case 'support':
					this.updateSupport(data)
						break
				}
			},
			updateGuanZhu(data) { // 更新关注信息
				// 拿到对象
				this.list.forEach(item => {
					if(item.userid === data.userid) {
						item.isguanzhu = data.data
					}
				})
			},
			updateSupport(data) { // 更新顶踩数据状态
				// 拿到当前对象
				let obj = this.list.find(value => {
					return value.id === data.post_id
				})
				if (!obj) return
				let oldindex = obj.infonum.index // 操作前的状态
				obj.infonum.index = (data.do == 'ding') ? 1 : 2 // 操作后的状态
				if (oldindex !== 0) { // 之前操作过
					oldindex == 1 ? obj.infonum.dingnum-- : obj.infonum.cainum--
				}
				if (obj.infonum.index !== 0) { // 当前操作
					obj.infonum.index == 1 ? obj.infonum.dingnum++ : obj.infonum.cainum++
				}
			},
			async getData() { // 搜索事件
				// 请求服务器
				uni.showLoading({ title: 'Loading...' })
				let url = '/search/post'
				switch (this.searchType) {
					case 'post':
					url = '/search/post'
						break
					case 'topic':
					url = '/search/topic'
						break
				}
				let [err, res] = await this.$http.post(url, {
					keyword: this.searchtext,
					page: this.page
				}, {token: true})
				let error = this.$http.errorCheck(err, res, ()=>{
					uni.hideLoading()
					this.isSearch = true
				}, ()=>{
					uni.hideLoading()
					this.isSearch = true
				})
				if (!error) return
				let arr = []
				let list = res.data.data.list
				if (list.length < 1) {
					this.list = []
					uni.hideLoading()
					this.isSearch = true
					return false
				}
				list.forEach(ele => {
					arr.push(this.__format(ele))
				})
				this.list = this.page > 1 ? this.list.concat(arr) : arr
				this.isSearch = true
				if (list.length < 10) {
					this.loadText = '没有更多数据了'
				} else {
					this.loadText = '上拉加载更多'
				}
				uni.hideLoading()
			},
			__format(item) { // 格式转化
				switch (this.searchType) {
					case 'post':
					return {
						userid: item.user.id,
						userpic: item.user.userpic,
						username: item.user.username,
						isguanzhu: !!item.user.fens.length,
						id: item.id,
						title: item.title,
						type:  'img', // img: 图文, video: 视频
						titlepic: item.titlepic,
						video: false,
						path: item.path,
						share: !!item.share,
						infonum: {
							index: (item.support.length>0) ? (item.support[0].type+1) : 0, // 0：没有操作；1：顶；2：踩；
							dingnum: item.ding_count,
							cainum: item.cai_count,
						},
						commentnum: item.comment_count,
						sharenum: item.sharenum,
					}
						break
					case 'topic':
					return {
						id: item.id,
						title: item.title,
						titlepic: item.titlepic,
						desc: item.desc,
						totalnum: item.post_count,
						todaynum: item.todaypost_count,
					}
						break
				}
			},
			loadMore() { // 上拉加载
				if (this.loadText !== '上拉加载更多') return
				// 修改状态
				this.loadText = '加载中...'
				// 获取数据
				this.page++
				this.getData()
			}
		}
	}
</script>

<style>

</style>
